<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="Description" content="" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>牙牙乐</title>
        <link rel="shortcut icon" href="">
        <link rel="stylesheet" type="text/css" href="css/mian.css" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <script src="js/axios.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/template-web.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/index.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <div class="header clearfix">
            <div class="nav">
                <ul>
                    <li>患者</li>
                    <li>咨询</li>
                </ul>
            </div>
            <div class="fast-search-box">
                <input class="fast-search" type="text" placeholder="快速搜索...">
            </div>
        </div>
        <div class="content">
            <div class="content-hd clearfix">
                <div class="add-patient">新增患者</div>
            </div>
            <div class="content-mian">
                <div class="message-list">
                    <ul class="message-box">
                        <li class="item">初诊<span class="num"></span></li>
                        <li class="item">复诊一(6个月)<span class="num"></span></li>
                        <li class="item">复诊二(12个月)<span class="num"></span></li>
                        <li class="item">复诊三(18个月)<span class="num"></span></li>
                        <li class="item">终诊<span class="num"></span></li>
                        <li class="item">归档<span class="num"></span></li>
                    </ul>
                </div>
                <div class="mian-search-box">
                    <div class="search-name">
                        <input type="" name="" id="" placeholder="请输入患者姓名..." />
                    </div>
                    <div class="search-creat-tiem">
                        <input type="" name="" id="" placeholder="选择病例创建时间" />
                    </div>
                    <div class="search-order-condition">
                        <input type="" name="" id="" placeholder="全部订单状态" />
                    </div>
                </div>
                <div class="table-box">
                    <div class="main-table table-hd">
                        <div class="name">
                            <p>患者</p>
                            <p>姓名</p>
                        </div>
                        <div class="picture">
                            <p>患者</p>
                            <p>头像</p>
                        </div>
                        <div class="cteate-time">病例创建时间</div>
                        <div class="condition">状态/操作</div>
                    </div>
                    <div class="table-body" id="content">


                    </div>
                </div>
            </div>
        </div>
        <div class="footer"></div>
    </body>
    <script type="text/javascript">
        window.document.body.onload = () => {
            new Index({
                URL: "https://www.easy-mock.com/mock/5cf5fdc140851e4067ffd5bd/care/list/vue",
                table_head: ".message-box .num",
                table_content: "content"
            })
        }
    </script>
    <script id="test" type="text/html">
        {{each user_list}}
         <div class="main-table">
            <div class="name row-1">
                {{$value.user_name}}
            </div>
            <div class="picture row-2">
                <div class="img-box">
                    <img src="{{$value.user_picture}}"/>
                </div>
            </div>
            <div class="create-time row-3">
                {{$value.user_create_time}}
            </div>
            <div class="user-state row-4">
                {{#$value.user_state}}
            </div>
        </div>
       {{/each}}
    </script>
</html>
